<template>
    <div id="company-cultrue">
        <!-- <video muted autoplay loop src="/index/video.mp4"></video> -->
        <div class="discribe1">
            <div> AMCC</div>
            <div>幻想乡驻江中分公司</div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { onMounted } from 'vue';

onMounted(() => {

})
</script>

<style lang="less" scoped>
#company-cultrue{
    width: 100%;
    height: 100vh;
    background-image: url("/index/banner-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    position: relative;

    @keyframes discribeSlideIn {
        0%{
            margin-top: -2rem;
            opacity: 0;
        }
        100%{
            margin-top: 0rem;
            opacity: 1;
        }
    }
    .discribe1{
        position: absolute;
        left: 50%;
        top: 30%;
        transform: translate(-50%, -50%);
        animation:discribeSlideIn 1s ;


        :nth-child(1){
            text-align: center;
            font-size: 8rem;
            color: white;
            font-weight: 600;
        }
        :nth-child(2){
            text-align: center;
            font-size: 5rem;
            color: white;
        }
    }
}
</style>
